<template>
    <span>
        <Button type="primary" size="small" @click="handleClientTaskAddShow">添加测试任务</Button>
        <Modal v-model="client_task_add_modal" title="添加任务" :mask-closable="false">
            <Form :model="task_current" :label-width="80">
                <FormItem label="任务名称">
                    <Input v-model="task_current.task_name"></Input>
                </FormItem>
                <FormItem label="任务类型">
                    <Select v-model="task_current.task_type">
                        <Option v-for="item in task_types" :value="item.value" :key="item.value">{{ item.label }}</Option>
                    </Select>
                </FormItem>
                <FormItem label="设备IP">
                    <Input v-model="task_current.client_ip"></Input>
                </FormItem>
                <FormItem label="设备端口">
                    <Input v-model="task_current.client_port"></Input>
                </FormItem>
            </Form>
            <template #footer>
                <Button type="primary" @click="handleClientTaskAddOk">确定</Button>
                <Button type="text" @click="handleClientTaskAddCancel">取消</Button>
            </template>
        </Modal>
    </span>
</template>

<script>
export default {
    name: "TaskAddButton",
    props: {
        client: Object,
    },
    data() {
        return {
            client_task_add_modal: false,
            task_current: {
                task_id: 0,
                client_id: '',
                task_name: '',
                task_type: 'PING',
                client_ip: '',
                client_port: 0,
                task_enable: 0
            },
            task_types: {
                'PING': { value: 'PING', label: 'PING' },
                'TCP': { value: 'TCP', label: 'TCP' }
            },
        };
    },
    methods: {
        handleClientTaskAddShow() {
            this.task_current.task_id = '';
            this.task_current.task_name = '';
            this.task_current.task_type = 'PING';
            this.task_current.client_id = this.client.client_id;
            this.task_current.client_ip = this.client.client_ip;
            this.task_current.client_port = 80;
            this.client_task_add_modal = true;
        },
        handleClientTaskAddOk() {
            if (!this.task_current.task_type) {
                this.errorMessage('请选择任务类型');
                return;
            }
            if (!this.task_current.client_ip) {
                this.errorMessage('请输入客户端IP');
                return;
            }
            if (!this.task_current.client_port || isNaN(this.task_current.client_port) || this.task_current.client_port < 1 || this.task_current.client_port > 65535) {
                this.task_current.client_port = 80;
            }else {
                this.task_current.client_port = parseInt(this.task_current.client_port);
            }
            this.$http.post('/add_task', this.task_current).then(res => {
                if (res.status == 'ok') {
                    this.$Message.success('添加成功');
                    this.client_task_add_modal = false;
                    this.$emit('success', res.data);
                }else {
                    this.errorMessage('添加失败');
                }
            });
        },
        handleClientTaskAddCancel() {
            this.client_task_add_modal = false;
        },
    }
}
</script>